// bg-zinc-900 border-zinc-900
// bg-blue-950 border-blue-950
// bg-red-900 border-red-900
// bg-green-950 border-green-950
// bg-rose-950 border-rose-950

import { PRODUCT_PRICES } from '@/config/products'

export const COLORS = [
  {
    label: 'Black',
    value: 'black',
    tw: 'zinc-900'
  },
  {
    label: 'Blue',
    value: 'blue',
    tw: 'blue-950'
  },
  {
    label: 'Red',
    value: 'red',
    tw: 'red-900'
  },
  {
    label: 'Green',
    value: 'green',
    tw: 'green-950'
  },
  {
    label: 'Rose',
    value: 'rose',
    tw: 'rose-950'
  }
] as const;

export const MODELS = {
  name: 'models',
  options: [
    {
      label: 'iPhone X',
      value: 'iphonex'
    },
    {
      label: 'iPhone 11',
      value: 'iphone11'
    },
    {
      label: 'iPhone 12',
      value: 'iphone12'
    },
    {
      label: 'iPhone 13',
      value: 'iphone13'
    }
  ]
} as const

export const MATERIALS = {
  name: 'material',
  options: [
    {
      label: 'Sillicone',
      value: 'sillicone',
      description: undefined,
      price: PRODUCT_PRICES.material.silicone
    },
    {
      label: 'Soft Polycarbonate',
      value: 'polycarbonate', 
      description: 'Scrath-resistant',
      price: PRODUCT_PRICES.material.polycarbonate
    }

  ]
} as const

export const FINISHES = {
  name: 'finish',
  options: [
    {
      label: 'Smooth Finish',
      value: 'smooth',
      description: undefined,
      price: PRODUCT_PRICES.finish.smooth
    },
    {
      label: 'Textured Finish',
      value: 'textured', 
      description: 'Soft grippy texture',
      price: PRODUCT_PRICES.finish.textured
    }

  ]
} as const